<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <!-- 
        固定定位：
            1）完全脱离标准文档流，叫脱标
            2）需要通过 left  right top  bottom 设置偏移量   要么使用一个，要么使用二个
            3）参考点是整个浏览器的视口
            4）一个女盒子会直接变成男盒子
            5）固定定位的元素内部还是按标准文档流进行布局
     -->
     <style>
         span{
             position: fixed;
             bottom: 10px;
             right: 10px;

             /* 出国的盒子，就不再严格区分男盒子，女盒子，人妖盒子 */
             width: 200px;
             height: 200px;
             background-color: gold;
         }
     </style>
</head>
<body>
    <span>
        <i>1</i>
        <i>2</i>
        <i>3</i>
    </span>
    <h1>我是一个H1</h1>
</body>
</html>